<!DOCTYPE html>
<html>
<head>
<?php $this->load->view('head'); ?>
</head>
<body>
<?php $this->load->view('header'); ?>
<div class="container-fluid main">
	<div class="row">
<?php $this->load->view('left'); ?>
		<div class="main-content col-md-10">
<?php $this->load->view('crumbs'); ?>
			<div class="panel panel-default panel-my">
				<div class="panel-heading">添加广告位</div>
				<div class="panel-body">
					<form class="form-horizontal J-ajax-form" action="<?php echo site_url('admin/advert/add'); ?>" method="post" accept-charset="utf-8" role="form">
                        <div class="form-group">
                            <label class="col-md-2 control-label">
                                选择表现方式
                            </label>
                            <div id="J-advert-type-radio" class="col-md-10">
                                <label class="radio-inline">
                                    <input data-panel="J-advert-type-panel-txt" type="radio" name="config[type]" value="txt"> 文字
                                </label>
                                <label class="radio-inline">
                                    <input data-panel="J-advert-type-panel-img" type="radio" name="config[type]" value="img" checked> 图片
                                </label>
                                <label class="radio-inline">
                                    <input data-panel="J-advert-type-panel-code" type="radio" name="config[type]" value="code"> 代码
                                </label>
                                <label class="radio-inline">
                                    <input data-panel="J-advert-type-panel-flash" type="radio" name="config[type]" value="flash"> Flash
                                </label>
                            </div>
                        </div>
                        <!-- 选择表现方式后加载进来的内容 -->
                        <div id="J-advert-type-panel"></div>
                        <div class="form-group">
                            <label class="col-md-2 control-label">
                                广告描述
                            </label>
                            <div class="col-md-10">
                                <span class="must-red">*</span>
                                <textarea class="form-control" rows="1" name="data[descrip]"></textarea>
                                <span class="help-block">广告信息描述，并不在前台显示</span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-2 control-label">
                                选择投放广告位
                            </label>
                            <div class="col-md-10">
                                <span class="must-red">*</span>
                                <div class="row">
                                    <div class="col-md-4">
                                        <select class="form-control input-sm" name="data[ckey]">
                                            <option disabled="disabled">选择要投放的广告位</option>
                                            <option disabled="disabled"></option>
<?php foreach ($advert_cates as $ckey => $name) { ?>
                                            <option value="<?php echo $ckey; ?>"><?php echo $name; ?></option>
<?php } ?>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!--
                        <div class="form-group">
                            <label class="col-md-2 control-label">
                                横向选择广告位
                            </label>
                            <div class="col-md-10">
                                <div class="row">
                                    <div class="col-md-4">
                                        <select class="form-control input-sm" multiple size="16" name="otherkey[]">
                                            <option disabled="disabled">选择要投放的广告位</option>
                                            <option disabled="disabled"></option>
<?php foreach ($advert_cates as $ckey => $name) { ?>
                                            <option value="<?php echo $ckey; ?>"><?php echo $name; ?></option>
<?php } ?>
                                        </select>
                                    </div>
                                </div>
                                <span class="help-block">同时将此广告添加到选择的广告位中（按住 <kbd>Ctrl</kbd> 不放可以多选）</span>
                            </div>
                        </div>
                        -->
                        <div class="form-group">
                            <label class="col-md-2 control-label">
                                有效时间
                            </label>
                            <div class="col-md-10">
                                <div class="row">
                                    <div class="col-md-3">
                                        <div class="input-group">
                                            <div class="input-group-addon">开</div>
                                            <input type="datetime" class="form-control" name="data[stime]" value="<?php echo date('Y-m-d'); ?>">
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <div class="input-group">
                                            <div class="input-group-addon">结</div>
                                            <input type="datetime" class="form-control" name="data[etime]" value="<?php echo date('Y-m-d', strtotime('+1 year')); ?>">
                                        </div>
                                    </div>
                                </div>
                                <span class="help-block">留空表无期限 格式：yyyy-mm-dd</span>
                            </div>
                        </div>
						<div class="form-group">
                            <label class="col-md-2 control-label">
                                显示顺序
                            </label>
                            <div class="col-md-1">
                                <input type="number" class="form-control" name="data[vieworder]" value="0">
                            </div>
                        </div>
						<div class="form-group">
							<label class="col-md-2 control-label">
                                是否开启
                            </label>
							<div class="col-md-10 checkbox">
                                <label><input type="checkbox" name="data[status]">开启</label>
								<span class="help-block">开启后，广告位同时被开启</span>
                            </div>
                        </div>
						<div class="form-group btn-wrap">
							<div class="col-md-offset-2 col-md-10">
								<button type="submit" class="btn btn-primary J-ajax-submit-btn mr5">确认提交</button>
                            </div>
                        </div>
					</form>
				</div>
			</div>
			<!--/.panel -->
		</div>
		<!--/.main-content -->
	</div>
	<!--/.row -->
</div>
<!--/.container-fluid -->
<!-- 隐藏内容，选择表现方式后读取 -->
<div class="advert-type-panel">
    <div id="J-advert-type-panel-txt" style="display:none;">
        <legend>文字广告</legend>
        <div class="form-group">
            <label class="col-md-2 control-label">
                文字内容
            </label>
            <div class="col-md-10">
                <span class="must-red">*</span>
                <input type="text" class="form-control" name="config[title]" value="<?php echo $config['txt']['title'] ?>">
                <span class="help-block">显示出来的文字内容</span>
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label">
                点击链接
            </label>
            <div class="col-md-10">
                <span class="must-red">*</span>
                <input type="url" class="form-control" name="config[link]" value="<?php echo $config['txt']['link'] ?>" placeholder="http://">
                <span class="help-block">外链以 http:// 开头</span>
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label">
                文字颜色
            </label>
            <div class="col-md-10">
                <input type="text" class="form-control" name="config[color]" value="<?php echo $config['txt']['color'] ?>" placeholder="#F00">
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label">
                文字大小[像素]
            </label>
            <div class="col-md-10">
                <input type="number" class="form-control" name="config[size]" value="<?php echo $config['txt']['size'] ?>">
                <span class="help-block">0代表默认12号宋体</span>
            </div>
        </div>
    </div>
    <div id="J-advert-type-panel-img" style="display:none;">
        <legend>图片广告</legend>
        <div class="form-group">
            <label class="col-md-2 control-label">
                图片地址
            </label>
            <div class="col-md-10">
                <div class="J-advert-img-nav mb5">
                    <label class="radio-inline">
                        <input data-panel="J-advert-img-panel-url" type="radio" name="_imgurltype" checked> 图片地址
                    </label>
                    <label class="radio-inline">
                        <input data-panel="J-advert-img-panel-file" type="radio" name="_imgurltype"> 图片上传
                    </label>
                </div>
                <span class="must-red">*</span>
                <div id="J-advert-img-panel-url" class="J-advert-img-panel">
                    <input type="text" class="form-control" name="config[url]" value="<?php echo $config['img']['url'] ?>" placeholder="http://">
                </div>
                <div id="J-advert-img-panel-file" class="J-advert-img-panel" style="display:none;">
                    <input type="file" name="config[uploadurl]">
                </div>
                <span class="help-block">外链以 http:// 开头</span>
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label">
                点击链接
            </label>
            <div class="col-md-10">
                <span class="must-red">*</span>
                <input type="url" class="form-control" name="config[link]" value="<?php echo $config['img']['link'] ?>" placeholder="http://">
                <span class="help-block">外链以 http:// 开头</span>
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label">
                图片提示
            </label>
            <div class="col-md-10">
                <input type="text" class="form-control" name="config[title]" value="<?php echo $config['img']['title'] ?>">
                <span class="help-block">显示广告时，鼠标放上去的提示信息（title属性的内容）</span>
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label">
                图片宽高
            </label>
            <div class="col-md-10">
                <div class="row">
                    <div class="col-md-2">
                        <div class="input-group">
                            <div class="input-group-addon">宽</div>
                            <input type="number" class="form-control" name="config[width]" value="<?php echo $config['img']['width'] ?>" placeholder="">
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="input-group">
                            <div class="input-group-addon">高</div>
                            <input type="number" class="form-control" name="config[height]" value="<?php echo $config['img']['height'] ?>" placeholder="">
                        </div>
                    </div>
                </div>
                <span class="help-block">例如: 98%(页面宽度和高度的98%) 或 120像素，为空时默认120px，120px</span>
            </div>
        </div>
    </div>
    <div id="J-advert-type-panel-code" style="display:none;">
        <legend>代码广告</legend>
        <div class="form-group">
            <label class="col-md-2 control-label">
                广告代码
            </label>
            <div class="col-md-10">
                <span class="must-red">*</span>
                <textarea class="form-control" rows="3" name="config[htmlcode]"><?php echo $config['code']['htmlcode']; ?></textarea>
                <span class="help-block">html代码</span>
            </div>
        </div>
    </div>
    <div id="J-advert-type-panel-flash" style="display:none;">
        <legend>Flash广告</legend>
        <div class="form-group">
            <label class="col-md-2 control-label">
                Flash地址
            </label>
            <div class="col-md-10">
                <span class="must-red">*</span>
                <input type="url" class="form-control" name="config[link]" value="<?php echo $config['flash']['link'] ?>" placeholder="http://">
                <span class="help-block">外链以http://开头</span>
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label">
                Flash宽高
            </label>
            <div class="col-md-10">
                <span class="must-red">*</span>
                <div class="row">
                    <div class="col-md-2">
                        <div class="input-group">
                            <div class="input-group-addon">宽</div>
                            <input type="number" class="form-control" name="config[width]" value="<?php echo $config['flash']['width'] ?>" placeholder="">
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="input-group">
                            <div class="input-group-addon">宽</div>
                            <input type="number" class="form-control" name="config[height]" value="<?php echo $config['flash']['height'] ?>" placeholder="">
                        </div>
                    </div>
                </div>
                <span class="help-block">例如: 98%(页面宽度和高度的98%) 或 120像素，为空时默认120px，120px</span>
            </div>
        </div>
    </div>
</div>
<!--/#J-advert-type-panel -->
<?php $this->load->view('footer'); ?>
<script>
$(function(){
    //选择表现方式 页面载入判断
    var J_checked = $('#J-advert-type-radio input:radio:checked');
    if(J_checked.length) {
        showAdvertTypePanel(J_checked.data('panel'));
    }
    //选择表现方式 切换选项
    $('#J-advert-type-radio input:radio').on('change', function(e){
        showAdvertTypePanel($(this).data('panel'));
    });
    //请求对应 选择表现方式
    function showAdvertTypePanel(id){
        if (! id) return false;
        $('#J-advert-type-panel').html($('#' + id).html());
    }

    //切换图片上传方式
    $('#J-advert-type-panel').on('change', '.J-advert-img-nav input:radio', function(e){
        e.preventDefault();
        $('#' + $(this).data('panel')).show().siblings('.J-advert-img-panel').hide();
    });
});
</script>
</body>
</html>